<template>
	<div @dblclick="ding" v-drag class="ding" ref="two">
        <i class="el-icon-top" id="up"></i>
	</div>
</template>

<script>
export default {
  mounted () {
    const one = this.$refs.two

    window.addEventListener('scroll', function () {
      const h = document.documentElement.scrollTop

      if (h > 100) {
        one.style.opacity = 0.8
      } else {
        one.style.opacity = 0
      }
    })
  },
  methods: {
    ding () {
      scrollTo(0, 0)
    }
  }
}
</script>

<style scoped lang="scss">
.ding {
  width: 40px;
  height: 40px;
  background: linear-gradient(to right, #1493fa, #01c6fa);
  position: absolute;
opacity :0;
  text-align: center;
  border-radius: 50%;
  line-height: 100px;
  bottom: 100px;
  right: 100px;
  z-index: 99999;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
